<!-- BEGIN PAGE HEADER-->
<h3 class="page-title">
    员工管理
</h3>
<div class="container-fluid" ng-show="!empGrid.edit">
    <div class="col-md-4 portlet">
        <div class="portlet-title" style="width: 95%;">
            <div class="caption">
                	部门
            </div>
        </div>
        <div class="portlet-body">
            <div class="ztree" style="height:450px; overflow:auto;" id="deptTree"></div>
        </div>
    </div>
    <div class="col-md-8 portlet">
        <div class="portlet-title">
        		<button class="btn btn-success title-action" ng-click="empGrid.add();" tabindex="0">
					<i class="fa fa-plus"></i> 新增员工
				</button>
				<div class="title-search-box">
					<input type="text" placeholder="员工编码或姓名" class="search-field" ng-model="empGrid.query.codeOrName" style="width: 180px;" maxlength="100">
					<a class="fa fa-search" ng-click="empGrid.query();"></a>
				</div>
        </div>
        <div class="portlet-body">
            <table ed-grid="empGrid" class="table table-striped table-bordered table-advance table-hover"
                   ed-url="emp/query.do" ed-model="emp">
                <thead>
                <tr>
                    <th ed-data="_index"></th>
                    <th ed-data="empCode">员工名</th>
                    <th ed-data="empName">员工姓名</th>
                    <th ed-data="gender | code : 'gender'">性别</th>
                    <th ed-data="telephone">手机号码</th>
                    <th ed-data="poses">岗位</th>
                    <th ed-data="_edit" width="120">操作</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
<!-- END PAGE HEADER-->
<!-- BEGIN MAIN CONTENT -->

<div class="portlet light bordered edit" ng-show="empGrid.edit">
    <div class="portlet-title">
        <div class="caption">
            <i class="icon-equalizer font-red-sunglo"></i>
            <span class="caption-subject font-red-sunglo bold uppercase">员工编辑</span>
        </div>
        <div class="actions">
            <a class="btn btn-circle btn-icon-only btn-default" href="javascript:;" ng-click="empGrid.cancel();">
                <i class="icon-action-undo"></i>
            </a>
        </div>
    </div>
    <div class="portlet-body form">
        <!-- BEGIN FORM-->
        <form action="#" class="form-horizontal w5c-form" w5c-form-validate novalidate name="validateForm">
            <div class="form-body">
                <div class="form-group">
                    <label class="col-md-3 control-label">员工编号</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" name="empCode" ng-model="emp.empCode" required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">员工姓名</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" name="empName" ng-model="emp.empName"
                               required ed-validate="name" ng-maxlength="10">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">性别</label>

                    <div class="col-md-4">
                        <select class="form-control" name="gender" ng-model="emp.gender"
                                ng-options="opt.value as opt.name for opt in options.gender" required></select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">手机号码</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" ng-model="emp.telephone">
                    </div>
                </div>
                <div class="form-group" ng-repeat="pos in emp.poses">
                    <label class="col-md-3 control-label" ng-if="$index == 0">岗位</label>
                    <label class="col-md-3 control-label" ng-if="$index > 0">兼职岗位</label>

                    <div class="col-md-3" style="padding-right: 0;">
                        <div ed-combotree
                             data-options="idField: 'deptId', textField: 'deptName', parentIdField: 'parentDeptId'"
                             ng-model="pos.deptId" ed-data="depts"></div>
                    </div>
                    <div class="col-md-1" style="padding-left: 0;">
                        <select class="form-control" name="pos" ng-model="pos.posId"
                                ng-options="opt.value as opt.name for opt in options.pos" required></select>
                    </div>
                    <div class="col-md-1">
                        <a href="javascript:;" class="btn btn-circle btn-xs green" style="margin-top: 5px;" ng-click="addPos()" ng-if="$index == 0">
                            <i class="fa fa-plus"></i>
                        </a>
                        <a href="javascript:;" class="btn btn-circle btn-xs red" style="margin-top: 5px;" ng-click="deletePos($index)" ng-if="$index > 0">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">员工描述</label>

                    <div class="col-md-4">
                        <textarea class="form-control" rows="3" ng-model="emp.remark"></textarea>
                    </div>
                </div>
            </div>
            <div class="form-actions">
                <div class="row">
                    <div class="col-md-offset-3 col-md-4">
                        <button type="button" class="btn green" w5c-form-submit="empGrid.save()"><i
                                class="fa fa-save"></i> 保存
                        </button>
                        <button type="button" class="btn default" ng-click="empGrid.cancel();validateForm.reset();"><i
                                class="fa fa-times"></i> 取消
                        </button>
                    </div>
                </div>
            </div>
        </form>
        <!-- END FORM-->
    </div>
</div>